<script setup>
import { onMounted, nextTick, ref, reactive, watch, toRefs, onBeforeMount ,onUpdated} from 'vue'
import mitt from '../assets/js/mitt';
let page = ref(0)
const props = defineProps({
  num: {
    type: Number,
    default: 100
  }
})
const { num } = toRefs(props)
const str = ref < String > ("BBB")

const mittNum = ref(0)

onMounted(() => {
  mitt.on("test1", data => {
    console.log("b", data);
    mittNum.value = data
  })
})
onBeforeMount(() => {
  mitt.off('test1');
});
onUpdated(() => {
  console.log("zib update");
})
</script>

<template>

  <div id="contain">
    BBB
    <div>{{ num }}</div>
    <div>
      mitt:{{ mittNum }}

    </div>
    {{ str }}
  </div>
</template>

<style lang='less'>

</style>